<template>
  <div class="app-container add">
    <h4>计量核查信息</h4>
    <table class="table"   border="1" rules="all">
      <tr>
        <td>设备标题</td>
        <td colspan="3">{{detailForm.deviceName}}</td>
      </tr>
      <tr>
        <td>类别</td>
        <td colspan="3"></td>
      </tr>
      <tr>
        <td>品牌</td>
        <td>测试</td>
        <td>型号</td>
        <td>测试</td>
      </tr>
      <tr>
        <td>单位</td>
        <td></td>
        <td>供应商</td>
        <td>广东正业科技</td>
      </tr>
      <tr>
        <td>位置</td>
        <td>风塔软件/英格尔/123</td>
        <td>负责人</td>
        <td>
          管理员
        </td>
      </tr>
      <tr>
        <td>计划类型</td>
        <td>{{detailForm.planType}}</td>
        <td>内外部计量</td>
        <td>
          <template v-if="detailForm.inoutMetering==1">内部</template>
          <template v-if="detailForm.inoutMetering==2">外部</template>
        </td>
      </tr>
      <tr>
        <td>计量单位/部门</td>
        <td>{{detailForm.meteringDept}}</td>
        <td>提前提醒时间</td>
        <td>{{detailForm.noticeDate}}{{detailForm.noticeUnit}}</td>
      </tr>
      <tr>
        <td>检定周期</td>
        <td>{{detailForm.meteringDate}}{{detailForm.meteringUnit}}</td>
        <td>下次检定周期</td>
        <td>{{detailForm.nextMeteringDate}}</td>
      </tr>
      <tr>
        <td>计量范围</td>
        <td colspan="3">{{detailForm.meteringRange}}</td>
      </tr>
      <tr>
        <td>计量精度</td>
        <td>{{detailForm.meteringPrecision}}</td>
        <td>允许误差</td>
        <td>{{detailForm.allowError}}</td>
      </tr>
      <tr>
        <td>备注</td>
        <td colspan="3">{{detailForm.remark}}</td>
      </tr>
    </table>
    <div class="title">
      <h4>相关附件</h4>
      <el-upload
        class="upload-demo"
        action="https://jsonplaceholder.typicode.com/posts/"
        :file-list="fileList">
      </el-upload>
    </div>
  </div>
</template>

<script>
  export default {
    name: "add.vue",
    data() {
      return {
        fileList: [{
          name: 'food.jpeg',
          url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
        }],
        detailForm: '',
      }
    },
    created() {
      this.detailForm = this.$route.query.data
      console.log(this.$route.query.data)//接受参数
    },
    methods: {}
  }
</script>

<style scoped lang="scss">
    h4 {
      color: #05A380;
    }

    .title {
      margin: 20px 0 0;
      overflow: hidden;
      width:900px;
      h4 {
        line-height: 36px;
        margin: 0;
      }
    }

    .table {
      margin-left: 15px;
      border: 1px solid #cccccc;
      color: #606266;
      font-size: inherit;

      tr {
        td:nth-child(2n-1) {
          width: 150px;
          text-align: center;
        }

        td {
          width: 300px;
          line-height: 35px;
          padding-left: 10px;
        }
      }
    }

</style>
